package content.views.works;
import feffects.easing.Quad;
import js.DomCanvas;
import js.Lib;
import tools.ASprite;
import tools.BoundProvider;

/**
 * ...
 * @author PRASS
 */

class LayerWorks extends ASprite
{
	private var _container 	: ASprite;
	
	private var _title 		: JQuery;
	private var _subtitle 	: JQuery;
	private var _desc	 	: JQuery;
	private var _credits 	: JQuery;
	private var _vDemo	 	: ASprite;
	private var _vSite	 	: ASprite;
	private var _data 		: Object;
	private var _urlSite	: String;
	
	private var _regW		: Int;
	private var _regH		: Int;

	public function new( dom : JQuery ) 
	{
		super(dom);
		
		var html : String = '<div><div id="worklayer"></div>';
		
		dom.append(html);
		
		_container = new ASprite(new JQuery("#worklayer"));
		_container.dom.css("padding", "20px");
		
		var spans : String = '<span id="worktitle"></span><span id="worksubtitle"></span><span id="workcredits"></span><span id="workdesc"></span><span id="viewDemo">VIEW DEMO</span><span id="viewSite">VIEW SITE</span>';
		
		_container.dom.append(spans);
		
		_title 		= new JQuery("#worktitle");
		_subtitle 	= new JQuery("#worksubtitle");
		_desc 		= new JQuery("#workdesc");
		_credits	= new JQuery("#workcredits");
		_vDemo		= new ASprite( new JQuery("#viewDemo"));
		_vSite		= new ASprite( new JQuery("#viewSite"));
		
		_title.addClass("worktextfield");
		_subtitle.addClass("worktextfield");
		_desc.addClass("worktextfield");
		_credits.addClass("worktextfield");
		_vDemo.dom.addClass("worktextfield bt");
		_vSite.dom.addClass("worktextfield bt");
		
		setWidth(250);
		setHeight(150);

		setY(-150);
		
		_container.setWidth(250);
		_container.setHeight(0);
		
		_container.setAlpha(0);
	}
	
	public function build( data : Object ) : Void
	{
		_data = data;
		_urlSite = data.url;
		
		_container.tween( _container.getAlpha(), _container.setAlpha, .5, 250, Quad.easeIn);
		tween( getY(), setY, -150, 300, Quad.easeIn, _reload);
	}
	
	private function _reload() : Void
	{
		_container.setAlpha(0);
		_container.setHeight(0);
		setY(100);
		
		_title.empty();
		_subtitle.empty();
		_desc.empty();
		_credits.empty();
		
		if ( _data.demo != "" )
			_vDemo.visible(true);
		else
			_vDemo.visible(false);
			
		if ( _data.url != "" )
		{
			_vSite.setAlpha(0);
			_vSite.visible(true);
			_vSite.dom.empty();
			_vSite.dom.append('<a href="' + _urlSite + '" target="_blank">VIEW SITE</a>');
			_vSite.tween(0, _vSite.setAlpha, 1, 300, Quad.easeInOut, null, 400);
			
		} else _vSite.visible(false);
		
		_title.append( _data.title );
		_subtitle.append( _data.subtitle );
		_desc.append( _data.desc );
		_credits.append( _data.credits );
		
		tweens( [ {prop:_container.setHeight, init:_container.getHeight(), value:150 }, {prop:_container.setAlpha, init:_container.getAlpha(), value:1 } ], 500, Quad.easeInOut);
	}
	
	public function demoButton() : JQuery
	{
		return _vDemo.dom;
	}

	
}